import Vue from 'vue'

import 'normalize.css/normalize.css' // A modern alternative to CSS resets

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import locale from 'element-ui/lib/locale/lang/en' // lang i18n
// 注册 VueI18n
import i18n from '@/lang';

import '@/styles/index.scss' // 全局样式

import App from './App'
import store from './store'
import router from './router'

import '@/icons' // icon
import '@/permission' // permission control

/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online ! ! !
 */
// if (process.env.NODE_ENV === 'production') {
//   const { mockXHR } = require('../mock')
//   mockXHR()
// }

// set ElementUI lang to EN
// Vue.use(ElementUI, { locale })
// 如果想要中文版 element-ui，按如下方式声明
// 控制 element 组件的语言
Vue.use(ElementUI, {
  // element 支持 i18n的处理
  // key 语言包
  // i18n 会根据当前的 locale 属性去寻找对应的显示内容
  // t方法 会根据 key 的值去对应的语言包里寻找对应的内容
  i18n: (key, val) => i18n.t(key, val)
})


// 导入所有的自定义指令
// directives 别名
import * as directives from '@/directives'
// 遍历所有导出的指令对象  完成自定义指令的注册
Object.keys(directives).forEach(key => {
  // directive('指令名',指令的值)
  Vue.directive(key, directives[key])
})

// 全局注册组件
// 第一种方式
// import PageTools from '@/components/PageTools';
// Vue.component("page-tooles", PageTools)

// 第二种方式
// 把所有组件放在一起，然后导入注册
import Components from '@/components';
Vue.use(Components)

// 全局注册过滤器
import * as filters from '@/filters';
// 遍历所有导出的过滤方法，完成过滤器的全局注册
// Object.keys(filters) 以数组的形式输出所有键
Object.keys(filters).forEach(key => {
  // key 过滤的名字，filters[key] key 对应的方法
  Vue.filter(key, filters[key])
})

// 全局混入
import CheckPermission from '@/mixins/checkPermission';
Vue.mixin(CheckPermission)

Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  store, i18n,
  render: h => h(App)
})
